<template>
<div class="root">
  <!-- <MyHeader bgColor="red" fontColor="pink" title="我的"></MyHeader> -->
  <MyHeader bgColor="red" fontColor="#fff" 
  title="购物车案例"></MyHeader>
  <MyGoods v-for="item in list" 
  :key="item.id"
  :obj="item"></MyGoods>
  <MyFooter :arr="list"></MyFooter>
</div>
</template>

<script>
import MyHeader from "./components/MyHeader.vue"
import MyGoods from "./components/MyGoods.vue"
import MyFooter from "./components/MyFooter.vue"
import { getGoods } from "./api/cart.js"
export default {
  components: {
    MyHeader,
    MyGoods,
    MyFooter
  },
  data(){
    return {
      list: []
    }
  },
  created(){
    // 获取购物车列表数据
    getGoods().then(res=>{
      // console.log("成功：",res);
      this.list = res.data.list;
    })
  }
}
</script>
<style scoped>
.root{
  padding-top: 45px;
}
</style>